<!-- 个人信息  -->
<template>
	<view class="Tatal ">
		<!-- 个人信息 -->
		<view class="xinxi-view F">
			<view class="ph">
				<image class="photo1" :src="list.headPortrait"></image>
			</view>
			<view class="xinxi">
				<text><strong>姓名：{{list.name}}</strong></text>
				<text><strong>姓别：{{list.gender==1?'女':'男'}}</strong></text>
				<text><strong>年龄：{{list.age}}</strong></text>
			</view>
		</view>

		<!-- 检查记录 -->
		<view class="F jiancha">
			<text><strong>检查记录</strong></text>
		</view>

		<!-- 滑动 -->
		<scroll-view scroll-x="true" class="Check F" @scroll="scroll" show-scrollbar="ture">
			<view class="Check1" v-for="item in data" :key="item.id" @click="renal(list.id, item.subjectId,item.subjectName)">
				<image class="Ellipse" :src="item.pic"></image>
				<text>{{item.subjectName}}</text>
			</view>
		</scroll-view>


		<!-- 折叠 -->
		<view class=" Check3 F">
			<view class="Check2 ">
				<text>历史医嘱</text>
			</view>
			<view class="Check4">
				<text>临时医嘱</text>
				<view class="Leave1">
					<image v-show="ref1==true" @click="go1" class="Leave1-img" src="../../static/tab3/boo.png"></image>
					<image v-show="ref1==false" @click="go1" class="Leave1-img" src="../../static/tab3/top.png"></image>
				</view>
			</view>
			<view v-show="ref1" class="Check4" @click="Dorders(item.ordersId)" v-for="item in shortTimeOrders">
				<text>{{item.patientName}}</text>
				<text class="Leave1"><strong>{{item.executionTime}}</strong></text>
			</view>
			<view class="Check4">
				<text>长期医嘱</text>
				<view class="Leave1">
					<image v-show="ref2==true" @click="go" class="Leave1-img" src="../../static/tab3/boo.png"></image>
					<image v-show="ref2==false" @click="go" class="Leave1-img" src="../../static/tab3/top.png"></image>
				</view>
			</view>
			<view v-show="ref2" class="Check4" @click="Dorders(item.ordersId)" v-for="item in longTimeOrders">
				<text>{{item.patientName}}</text>
				<text class="Leave1"><strong>{{item.executionTime}}</strong></text>
			</view>
		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				suName: '',
				id: 0,
				suid: 0,
				da: 0,
				inId: 10,
				shortTimeOrders: [],
				longTimeOrders: [],
				data: [],
				list: [],
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				ref1: false, //临时医嘱
				ref2: false, //长期医嘱
			}


		},
		onLoad(options) {
			this.inId = JSON.parse(options.inde);
			console.log(this.inId);
			uni.request({
				url: this.$serverUrl + '/app/hospital/patient/patientInfo',
				data: {
					patientId: this.inId
				},
				method: "POST",
				header: {
					'token': uni.getStorageSync('token'),
					'content-type': "application/json",
					'content-type': "application/x-www-form-urlencoded"
				},
				success: (ret) => {
					uni.getStorageSync('token', ret.data.token),
					console.log(uni.getStorageSync('token'))
					console.log(ret.data.data);
					this.list = ret.data.data;
					if (ret.data.data.name == null) {
						uni.setNavigationBarTitle({
							title: ''
						});
					} else {
						uni.setNavigationBarTitle({
							title: this.list.name
						});
					}

					this.data = this.list.subjectList;

					this.longTimeOrders = this.list.longTimeOrdersList;
					console.log(this.longTimeOrders)
					this.shortTimeOrders = this.list.shortTimeOrdersList;
				}

			})

		},
		methods: {
			Dorders(patientId) {
				console.log(patientId);
				uni.navigateTo({
					url: '/pages/patientmanage/Dorders?da=' + patientId
				})

			},
			renal(id, subjectId, subjectName) {
				console.log(id, subjectId, subjectName);
				uni.navigateTo({
					url: '/pages/patientmanage/Renal?suid=' + subjectId + '&id=' + id + '&suName=' + subjectName
				})
			},
			scroll: function(e) {
				console.log(e)
				this.old.scrollTop = e.detail.scrollTop
			},
			go: function() {
				this.ref2 = !this.ref2;
			},
			go1: function() {
				this.ref1 = !this.ref1;
			}
		}
	}
</script>

<style>
	page {
		background-color: #F8F8F8;
	}

	.Tatal {
		display: flex;
		flex-direction: column;
		font-size: 30upx;
	}

	.xinxi-view {
		/* width: 200upx; */

		display: flex;
		flex-direction: row;
		height: 200upx;
		padding: 0upx 30upx;
		margin-top: 15upx;
		margin-bottom: 15upx;
		align-items: center;



	}

	/* 头像 */
	.ph {
		display: flex;
		align-items: center;
		margin-right: 40upx;
		width: 140upx;
		height: 140upx;
	}

	.photo1 {
		width: 140upx;
		height: 140upx;
		border-radius: 50%;
		justify-content: center;
		align-items: center;
	}

	/* 个人信息 */
	.xinxi {
		display: flex;
		flex-direction: column;
		/* align-items: center; */
		justify-content: flex-start;
	}

	/* 检查记录 */
	.jiancha {
		display: flex;
		align-items: center;
		padding-left: 30upx;
		height: 100upx;
	}

	.Check {
		/* 不换行 */
		white-space: nowrap;
		width: 100%;
		display: flex;
		flex-direction: row;
		height: 200upx;
		padding-left: 30upx;
		margin-top: 5upx;
		align-items: center;
	}

	.Check1 {
		/* display: inline-block; */
		display: inline-flex;
		flex-direction: column;
		align-items: center;
		margin-right: 60upx;
		margin-top: 35upx;
	}

	.Ellipse {
		width: 90upx;
		height: 90upx;
		border-radius: 50%;
	}

	.Check2 {
		height: 100upx;
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-left: 30upx;
		font-size: 30upx;
		/* padding-right: 30upx; */
		border-bottom: 5upx solid #eeedf0;
	}

	.Check2-left {
		justify-items: flex-start;
	}

	.Leave {
		display: flex;
		align-items: center;
		margin-left: auto;
		margin-right: 60upx;
	}

	.Check3 {
		display: flex;
		flex-direction: column;
		margin-top: 15upx;

	}

	.Check4 {
		height: 100upx;
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin: 0upx 30upx;
		margin-left: 30upx;
		margin-right: 30upx;
		border-bottom: 5upx solid #eeedf0;
	}

	.Leave1 {
		display: flex;
		align-items: center;
		margin-left: auto;
		margin-right: 60upx;
	}

	.Leave1-img {
		width: 16upx;
		height: 16upx;
	}
</style>
